<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>baby+系统登陆</title>
    <link rel="stylesheet" href="../css/login.css">
    <link rel="stylesheet" href="../util/bootstrap-3.3.7-dist/css/bootstrap.css">
    <link rel="stylesheet" href="../font/font-awesome-4.7.0/css/font-awesome.css">
</head>
<body>
	
	
<div class="loginPart">
	<h1>Baby+幼儿园管理系统</h1>
	 <p class="smallText">登录</p>
	 <div class="userId">
	 <input style="opacity: .5" type="text" id="username" placeholder="用户名">
	 </div>
	 <p class="remind">请输入用户名！</p>
	 <div class="userPwd">
	 <input style="opacity: .5" type="password" id="userpwd" placeholder="密码">
	 </div>
	 <p class="remind1">请输入密码！</p>
	 <div class="check">
	 <input type="checkbox" class="checkbox" ><div class="checkText">记住密码</div>
	 </div>
	 <div class="userLogin">
	 <input style="padding-left: 0" type="button" class="Login"  value="登陆">
	 </div>
  </div>
</body>
<script type="text/javascript" src="../js/data.js"></script>
<script src="../util/jquery-3.4.1.js"></script>
<script src="../util/bootstrap-3.3.7-dist/js/bootstrap.js"></script>
<script type="text/javascript">
	
	var str=document.cookie;
	var array=str.split(';');
	var json={};
    var isExist=false;
	$.each(array,function(index,value){
		if(array[index].indexOf('loginCookie')>=0){
		  isExist=true;
	      var array2=array[index].split('=');
		  json=strToJson(array2[1]);
		  return false;
		}else{
		  isExist=false;
		}
	})
    if(isExist){
		$('#username').val(json.name);
		$('#userpwd').val(json.pwd);
		$('.checkbox').prop('checked',true);
	}
	function strToJson(str){ 
	var json = eval('(' + str + ')'); 
	return json; 
	} 
	$("input:not('.checkbox')").on('input',function(){
		if($(this).val()!=''){
		$(this).parent().next().css('display','none');
		}
	})
	function login(){
	   let userName=$('#username').val();
	   let userPwd=$('#userpwd').val();
	   if( userName==''){
		   $('.remind').css('display','block');
		   return;
	   }else{
		    $('.remind').css('display','none'); 
	   }
	   if(userPwd==''){
	   		   $('.remind1').css('display','block');
	   		   return;
	   }else{
		    $('.remind1').css('display','none'); 
	   }
	   let read=JSON.parse(localStorage.getItem('staff'));
	   $.each(read,function(index,value){
		   if(value.name==userName&&value.password==userPwd){
			   var user={name:userName};
			   var cookie={name:userName,pwd:userPwd};
			   localStorage.setItem("loginUser",JSON.stringify(user));
			   if($('.checkbox').is(':checked')){
				  var date=new Date();
				  date.setDate(date.getDate()+3)
			      document.cookie='loginCookie='+JSON.stringify(cookie)+'; expires='+date;
			   }else{
				   var date=new Date();
				   date.setDate(date.getDate()-3);
				   document.cookie='loginCookie='+JSON.stringify(cookie)+'; expires='+date;   
			   }
			   window.open('index.html','_self');
			   return false;
		   }
		   if(index==read.length-1&&(value.name!=userName||value.password!=userPwd)){
			   alert('用户名或密码错误!');
	   }   
	   })
	   }
	$('.Login').on('click',login)
    $(document).on('keypress',function(){
		if(event.keyCode==13){
			login();
		}
	})
</script>

</html>